<template>
	<div>
		<van-image :src="item.url" alt="" lazy-load width="100%"/>
		<h3>{{ item.title }}</h3>
		<p>{{ item.desc }}</p>
		<b>{{ item.price }}</b>
	</div>
</template>


<script>
import axios from 'axios'
export default {
	name: 'detail',
	data() {
		return {
			id: this.$route.params.id,
			item: {}
		}
	},
	methods: {
		async fetchDetail() {
			const resp = await axios.get(`/api/post/${this.id}`)
			this.item = resp.data.data
		},
		async fetchDetail1() {
			const resp = await axios.get(`/api/post`, { params: { id: this.id } })
			this.item = resp.data.data
		},
		async fetchDetail2() {
			const resp = await axios.post(`/api/post`, { id: this.id })
			this.item = resp.data.data
		}	
	},
	mounted() {
		this.fetchDetail2()
	}
}

</script>

<style scoped>
img {
	width: 100%;
}
</style>